<style lang="scss" scoped>
  .item-wrap{
    position: relative;
    width: 355px; height: 150px;
    background: #fff;
    box-shadow:0px 1px 2px 0px rgba(0,0,0,0.04);
    border-radius:4px;
    text-align: left;
    cursor: pointer;
  }

  .item-icon{
    position: absolute;
    width:42px;
    height:42px;
    left: 15px; top: 20px;
  }

  .item-name{
    position: absolute;
    height:42px;
    left: 72px; top: 20px;
    line-height: 42px;
    font-size:25px;
    color:rgba(17,17,17,1);
  }

  .item-text{
    position: absolute;
    height:42px;
    left: 72px; top: 61px;
    height:36px;
    font-size:13px;
    color:rgba(85,85,85,1);
    line-height:18px;
  }

  .item-bottom{
    position: absolute;
    width:284px; height: 35px;
    right: 0; bottom: 0;
    border-top:1px dashed rgba(207,207,207,1);
  }

  .item-price{
    position: absolute;
    left: 0; top: 0;
    height: 35px;
    font-size:13px;
    color:rgba(48,54,65,1);
    line-height:35px;
  }

  .item-shopnner{
    position: absolute;
    right: 16px; top: 0;
    height: 35px;
    font-size:13px;
    color:#888888;
    line-height:35px;
  }
</style>

<template>
  <div class="item-wrap">
    <img src="" class="item-icon">
    <div class="item-name">{{setItem.name}}</div>
    <div class="item-text">{{descSet}}</div>
    <div class="item-bottom">
      <div class="item-price">¥{{setItem.price}}</div>
      <div class="item-shopnner">无字段</div>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {

      }
    },
    methods: {
      outLogin () {

      }
    },
    computed:{
      descSet(){
        let list = this.setItem.mset.split(',')
        return  list[0] + '个外框，' + list[1] + '个内框，' + list[2] + '个外衬卡纸，' + list[3] + '个中衬卡纸，' + list[4] + '个内衬卡纸'
      }
    },
    props: {
      setItem: {
        type:Object,
        default() {
          return {}
        }
      },
    },
    mounted () {

    }
  }
</script>
